<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>Material Admin</title>

    <!-- Vendor CSS -->
    <link th:href="@{vendors/bower_components/fullcalendar/dist/fullcalendar.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/animate.css/animate.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/bootstrap-sweetalert/lib/sweet-alert.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/material-design-iconic-font/dist/css/material-design-iconic-font.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bootgrid/jquery.bootgrid.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/bootstrap-validator/bootstrapValidator.min.css}" rel="stylesheet"/>
    <link th:href="@{vendors/bower_components/bootstrap-select/dist/css/bootstrap-select.css}" rel="stylesheet"/>

    <!-- CSS -->
    <link th:href="@{css/app.min.1.css}" rel="stylesheet"/>
    <link th:href="@{css/app.min.2.css}" rel="stylesheet"/>

</head>
<body>
<header id="header" class="clearfix" data-current-skin="blue">
    <ul class="header-inner">
        <li id="menu-trigger" data-trigger="#sidebar" class="open">
            <div class="line-wrap">
                <div class="line top"></div>
                <div class="line center"></div>
                <div class="line bottom"></div>
            </div>
        </li>

        <li class="logo hidden-xs">
            <a th:href="@{index.html}">UDC-接口API后台</a>
        </li>

        <li class="pull-right">
            <ul class="top-menu">
                <li id="toggle-width">
                    <div class="toggle-switch">
                        <input id="tw-switch" type="checkbox" hidden="hidden"/>
                        <label for="tw-switch" class="ts-helper"></label>
                    </div>
                </li>

                <!--<li id="top-search">
                    <a href=""><i class="tm-icon zmdi zmdi-search"></i></a>
                </li>
                <li class="dropdown">
                    <a data-toggle="dropdown" href="">
                        <i class="tm-icon zmdi zmdi-email"></i>
                        <i class="tmn-counts">6</i>
                    </a>
                    <div class="dropdown-menu dropdown-menu-lg pull-right">
                        <div class="listview">
                            <div class="lv-header">
                                Messages
                            </div>
                            <div class="lv-body">
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/1.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">David Belle</div>
                                            <small class="lv-small">Cum sociis natoque penatibus et magnis dis parturient montes</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/2.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Jonathan Morris</div>
                                            <small class="lv-small">Nunc quis diam diamurabitur at dolor elementum, dictum turpis vel</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/3.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Fredric Mitchell Jr.</div>
                                            <small class="lv-small">Phasellus a ante et est ornare accumsan at vel magnauis blandit turpis at augue ultricies</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/4.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Glenn Jecobs</div>
                                            <small class="lv-small">Ut vitae lacus sem ellentesque maximus, nunc sit amet varius dignissim, dui est consectetur neque</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/4.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Bill Phillips</div>
                                            <small class="lv-small">Proin laoreet commodo eros id faucibus. Donec ligula quam, imperdiet vel ante placerat</small>
                                        </div>
                                    </div>
                                </a>
                            </div>
                            <a class="lv-footer" href="">View All</a>
                        </div>
                    </div>
                </li>
                <li class="dropdown">
                    <a data-toggle="dropdown" href="">
                        <i class="tm-icon zmdi zmdi-notifications"></i>
                        <i class="tmn-counts">9</i>
                    </a>
                    <div class="dropdown-menu dropdown-menu-lg pull-right">
                        <div class="listview" id="notifications">
                            <div class="lv-header">
                                Notification

                                <ul class="actions">
                                    <li class="dropdown">
                                        <a href="" data-clear="notification">
                                            <i class="zmdi zmdi-check-all"></i>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div class="lv-body">
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/1.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">David Belle</div>
                                            <small class="lv-small">Cum sociis natoque penatibus et magnis dis parturient montes</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/2.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Jonathan Morris</div>
                                            <small class="lv-small">Nunc quis diam diamurabitur at dolor elementum, dictum turpis vel</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/3.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Fredric Mitchell Jr.</div>
                                            <small class="lv-small">Phasellus a ante et est ornare accumsan at vel magnauis blandit turpis at augue ultricies</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/4.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Glenn Jecobs</div>
                                            <small class="lv-small">Ut vitae lacus sem ellentesque maximus, nunc sit amet varius dignissim, dui est consectetur neque</small>
                                        </div>
                                    </div>
                                </a>
                                <a class="lv-item" href="">
                                    <div class="media">
                                        <div class="pull-left">
                                            <img class="lv-img-sm" th:src="@{img/profile-pics/4.jpg}" alt=""/>
                                        </div>
                                        <div class="media-body">
                                            <div class="lv-title">Bill Phillips</div>
                                            <small class="lv-small">Proin laoreet commodo eros id faucibus. Donec ligula quam, imperdiet vel ante placerat</small>
                                        </div>
                                    </div>
                                </a>
                            </div>

                            <a class="lv-footer" href="">View Previous</a>
                        </div>

                    </div>
                </li>
                <li class="dropdown hidden-xs">
                    <a data-toggle="dropdown" href="">
                        <i class="tm-icon zmdi zmdi-view-list-alt"></i>
                        <i class="tmn-counts">2</i>
                    </a>
                    <div class="dropdown-menu pull-right dropdown-menu-lg">
                        <div class="listview">
                            <div class="lv-header">
                                Tasks
                            </div>
                            <div class="lv-body">
                                <div class="lv-item">
                                    <div class="lv-title m-b-5">HTML5 Validation Report</div>

                                    <div class="progress">
                                        <div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100" style="width: 95%">
                                            <span class="sr-only">95% Complete (success)</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="lv-item">
                                    <div class="lv-title m-b-5">Google Chrome Extension</div>

                                    <div class="progress">
                                        <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
                                            <span class="sr-only">80% Complete (success)</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="lv-item">
                                    <div class="lv-title m-b-5">Social Intranet Projects</div>

                                    <div class="progress">
                                        <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
                                            <span class="sr-only">20% Complete</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="lv-item">
                                    <div class="lv-title m-b-5">Bootstrap Admin Template</div>

                                    <div class="progress">
                                        <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
                                            <span class="sr-only">60% Complete (warning)</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="lv-item">
                                    <div class="lv-title m-b-5">Youtube Client App</div>

                                    <div class="progress">
                                        <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
                                            <span class="sr-only">80% Complete (danger)</span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <a class="lv-footer" href="">View All</a>
                        </div>
                    </div>
                </li>
                <li class="dropdown">
                    <a data-toggle="dropdown" href=""><i class="tm-icon zmdi zmdi-more-vert"></i></a>
                    <ul class="dropdown-menu dm-icon pull-right">
                        <li class="skin-switch hidden-xs">
                            <span class="ss-skin bgm-lightblue" data-skin="lightblue"></span>
                            <span class="ss-skin bgm-bluegray" data-skin="bluegray"></span>
                            <span class="ss-skin bgm-cyan" data-skin="cyan"></span>
                            <span class="ss-skin bgm-teal" data-skin="teal"></span>
                            <span class="ss-skin bgm-orange" data-skin="orange"></span>
                            <span class="ss-skin bgm-blue" data-skin="blue"></span>
                        </li>
                        <li class="divider hidden-xs"></li>
                        <li class="hidden-xs">
                            <a data-action="fullscreen" href=""><i class="zmdi zmdi-fullscreen"></i> Toggle Fullscreen</a>
                        </li>
                        <li>
                            <a data-action="clear-localstorage" href=""><i class="zmdi zmdi-delete"></i> Clear Local Storage</a>
                        </li>
                        <li>
                            <a href=""><i class="zmdi zmdi-face"></i> Privacy Settings</a>
                        </li>
                        <li>
                            <a href=""><i class="zmdi zmdi-settings"></i> Other Settings</a>
                        </li>
                    </ul>
                </li>
                <li class="hidden-xs" id="chat-trigger" data-trigger="#chat">
                    <a href=""><i class="tm-icon zmdi zmdi-comment-alt-text"></i></a>
                </li>-->
            </ul>
        </li>
    </ul>


    <!-- Top Search Content -->
    <div id="top-search-wrap">
        <div class="tsw-inner">
            <i id="top-search-close" class="zmdi zmdi-arrow-left"></i>
            <input type="text"/>
        </div>
    </div>
</header>

<section id="main" data-layout="layout-1">
    <aside id="sidebar" class="sidebar c-overflow toggled">
        <div class="profile-menu">
            <a href="">
                <div class="profile-pic">
                    <img th:src="@{img/profile-pics/1.jpg}" alt=""/>
                </div>

                <div class="profile-info">
                    UDC-接口API后台
                    <i class="zmdi zmdi-caret-down"></i>
                </div>
            </a>
            <ul class="main-menu">
                <!--<li>-->
                    <!--<a href="profile-about.html"><i class="zmdi zmdi-account"></i> View Profile</a>-->
                <!--</li>-->
                <!--<li>-->
                    <!--<a href=""><i class="zmdi zmdi-input-antenna"></i> Privacy Settings</a>-->
                <!--</li>-->
                <!--<li>-->
                    <!--<a href=""><i class="zmdi zmdi-settings"></i> Settings</a>-->
                <!--</li>-->
                <li>
                    <a th:href="@{/logout}"><i class="zmdi zmdi-time-restore"></i> 注销</a>
                </li>
            </ul>
        </div>

        <ul class="main-menu">
            <li>
                <a href="/index">
                    <i class="zmdi zmdi-home"></i>
                    首页
                </a>
            </li>
            <li class="sub-menu">
                <a href="#">
                    <i class="zmdi zmdi-storage zmdi-hc-fw"></i>
                    接口管理
                </a>
                <ul>
                    <li>
                        <a href="/category/toCategoryIndex"  target="center">接口分类管理</a>
                    </li>
                    <li>
                        <a href="/interface/toInterfaceIndex"  target="center">接口管理</a>
                    </li>
                </ul>
            </li>
            <li class="sub-menu">
                <a href="#">
                    <i class="zmdi zmdi-code zmdi-hc-fw"></i>
                    接口请求
                </a>
                <ul>
                    <li>
                        <a href="/api/toApiIndex"  target="center">接口请求</a>
                    </li>
                </ul>
            </li>
        </ul>
    </aside>
    <aside id="chat" class="sidebar c-overflow">

        <div class="chat-search">
            <div class="fg-line">
                <input type="text" class="form-control" placeholder="Search People"/>
            </div>
        </div>

        <div class="listview">
            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left p-relative">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/2.jpg}" alt=""/>
                        <i class="chat-status-busy"></i>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Jonathan Morris</div>
                        <small class="lv-small">Available</small>
                    </div>
                </div>
            </a>

            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/1.jpg}" alt=""/>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">David Belle</div>
                        <small class="lv-small">Last seen 3 hours ago</small>
                    </div>
                </div>
            </a>

            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left p-relative">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/3.jpg}" alt=""/>
                        <i class="chat-status-online"></i>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Fredric Mitchell Jr.</div>
                        <small class="lv-small">Availble</small>
                    </div>
                </div>
            </a>

            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left p-relative">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/4.jpg}" alt=""/>
                        <i class="chat-status-online"></i>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Glenn Jecobs</div>
                        <small class="lv-small">Availble</small>
                    </div>
                </div>
            </a>

            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/5.jpg}" alt=""/>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Bill Phillips</div>
                        <small class="lv-small">Last seen 3 days ago</small>
                    </div>
                </div>
            </a>

            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/6.jpg}" alt=""/>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Wendy Mitchell</div>
                        <small class="lv-small">Last seen 2 minutes ago</small>
                    </div>
                </div>
            </a>
            <a class="lv-item" href="">
                <div class="media">
                    <div class="pull-left p-relative">
                        <img class="lv-img-sm" th:src="@{img/profile-pics/7.jpg}" alt=""/>
                        <i class="chat-status-busy"></i>
                    </div>
                    <div class="media-body">
                        <div class="lv-title">Teena Bell Ann</div>
                        <small class="lv-small">Busy</small>
                    </div>
                </div>
            </a>
        </div>
    </aside>
    <section id="content">
        <!--<div class="block-header">-->
            <!--<h2 id="currentMenu">首页</h2>-->
            <!--<ul class="actions">-->
                <!--<li>-->
                    <!--<a href="">-->
                        <!--<i class="zmdi zmdi-trending-up"></i>-->
                    <!--</a>-->
                <!--</li>-->
                <!--<li>-->
                    <!--<a href="">-->
                        <!--<i class="zmdi zmdi-check-all"></i>-->
                    <!--</a>-->
                <!--</li>-->
                <!--<li class="dropdown">-->
                    <!--<a href="" data-toggle="dropdown">-->
                        <!--<i class="zmdi zmdi-more-vert"></i>-->
                    <!--</a>-->

                    <!--<ul class="dropdown-menu dropdown-menu-right">-->
                        <!--<li>-->
                            <!--<a href="">Refresh</a>-->
                        <!--</li>-->
                        <!--<li>-->
                            <!--<a href="">Manage Widgets</a>-->
                        <!--</li>-->
                        <!--<li>-->
                            <!--<a href="">Widgets Settings</a>-->
                        <!--</li>-->
                    <!--</ul>-->
                <!--</li>-->
            <!--</ul>-->
        <!--</div>-->
        <div class="container" id="page-content">
            <div class="row">
                <div class="col-sm-12">
                    <!-- Calendar -->
                    <div id="calendar-widget"></div>
                </div>
            </div>
        </div>
    </section>
</section>

<footer id="footer">
    Copyright &copy; UDC
</footer>

<!-- Page Loader -->
<div class="page-loader">
    <div class="preloader pls-blue">
        <svg class="pl-circular" viewBox="25 25 50 50">
            <circle class="plc-path" cx="50" cy="50" r="20" />
        </svg>

        <p>Please wait...</p>
    </div>
</div>

<!-- Javascript Libraries -->
<script th:src="@{vendors/bower_components/jquery/dist/jquery.min.js}"></script>
<script th:src="@{vendors/bower_components/jquery/dist/jquery.form.js}"></script>
<script th:src="@{vendors/bower_components/bootstrap/dist/js/bootstrap.min.js}"></script>

<script th:src="@{vendors/bower_components/flot/jquery.flot.js}"></script>
<script th:src="@{vendors/bower_components/flot/jquery.flot.resize.js}"></script>
<script th:src="@{vendors/bower_components/flot.curvedlines/curvedLines.js}"></script>
<script th:src="@{vendors/sparklines/jquery.sparkline.min.js}"></script>
<script th:src="@{vendors/bower_components/jquery.easy-pie-chart/dist/jquery.easypiechart.min.js}"></script>

<script th:src="@{vendors/bower_components/moment/min/moment.min.js}"></script>
<script th:src="@{vendors/bower_components/bootstrap-select/dist/js/bootstrap-select.js}"></script>
<script th:src="@{vendors/bower_components/fullcalendar/dist/fullcalendar.min.js}"></script>
<script th:src="@{vendors/bower_components/fullcalendar/dist/lang/zh-cn.js}"></script>
<script th:src="@{vendors/bower_components/simpleWeather/jquery.simpleWeather.min.js}"></script>
<script th:src="@{vendors/bower_components/Waves/dist/waves.min.js}"></script>
<script th:src="@{vendors/bootstrap-growl/bootstrap-growl.min.js}"></script>
<script th:src="@{vendors/bower_components/bootstrap-sweetalert/lib/sweet-alert.min.js}"></script>
<script th:src="@{vendors/bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.concat.min.js}"></script>
<script th:src="@{vendors/bootgrid/jquery.bootgrid.updated.min.js}"></script>
<script th:src="@{vendors/bower_components/bootstrap-validator/bootstrapValidator.min.js}"></script>
<script th:src="@{vendors/bower_components/bootstrap-validator/lang/zh_CN.js}"></script>

<!-- Placeholder for IE9 -->
<!--[if IE 9 ]>
<script th:src="@{vendors/bower_components/jquery-placeholder/jquery.placeholder.min.js}"></script>
<![endif]-->

<script th:src="@{js/flot-charts/curved-line-chart.js}"></script>
<script th:src="@{js/flot-charts/line-chart.js}"></script>
<script th:src="@{js/charts.js}"></script>

<script th:src="@{js/functions.js}"></script>
<script th:src="@{js/demo.js}"></script>
<script type="text/javascript">
    $(function (){

        String.prototype.trim=function(){
            return this.replace(/(^\s*)|(\s*$)/g, "");
        }

        $.ajaxSetup({
            //关闭AJAX相应的缓存
            cache: false,
            error: function(jqXHR, textStatus, errorMsg){ // 出错时默认的处理函数
                $(".modal-backdrop").hide();
                $(".modal-dialog").hide();
                if(jqXHR.status==404){
                    $("#page-content").html($("#404_content").html());
                }else if(jqXHR.status==500){
                    $("#page-content").html($("#500_content").html());
                }else if(jqXHR.status==403){
                    $("#page-content").html($("#noauth_content").html());
                }else{
                    alert("系统错误，请稍后再试!");
                }
            }
        });

        $("a[target='center']").on('click', function () {
            var html="";
            $("#page-content").html(html);
            $.ajax({
                url : $(this).attr('href') + "?_=" + Math.random(),
                type : "post",
                dataType : 'html',
                async:false,
                success : function(data) {
                    html=data;
                }
            });

            $("#page-content").append(html);
            return false;
        });
    });
</script>
<div class="row" id="500" style="display: none">
    <div class="four-zero-content" id="500_content">
        <div class="four-zero"  style="margin-top: 8%;">
            <h2>500</h2>
            <small>抱歉，系统异常</small>

            <footer>
                <a href="/index"><i class="zmdi zmdi-home"></i></a>
            </footer>
        </div>
    </div>
</div>
<div class="row" id="404" style="display: none;">
    <div class="four-zero-content" id="404_content">
        <div class="four-zero" style="margin-top: 8%;">
            <h2>404</h2>
            <small>抱歉，此链接不存在</small>

            <footer>
                <a href="/index"><i class="zmdi zmdi-home"></i></a>
            </footer>
        </div>
    </div>
</div>
<div class="row" id="noauth" style="display: none;">
    <div class="four-zero-content" id="noauth_content">
        <div class="four-zero" style="margin-top: 8%;">
            <h2>403</h2>
            <small>抱歉，没有权限 </small>

            <footer>
                <a href="/index"><i class="zmdi zmdi-home"></i></a>
            </footer>
        </div>
    </div>
</div>
</body>
</html>